<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<link rel="stylesheet" href="__PUBLIC__/css/bootstrap.min.css" />
<link rel="stylesheet" href="__PUBLIC__/css/bootstrap-theme.min.css" />
<style>
    caption {
        text-align: center;
        font-size: 15px;
    }
</style>

<body>
<div class="dropdown">
    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
        待付款
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
        <li><a href="#">待付款</a></li>
        <li><a href="#">待发货</a></li>
        <li><a href="#">待收货</a></li>
    </ul>
</div>
<table class="table table-bordered" summary="上医道元" border="1px">
    <caption>上医道元 下单系统</caption>
    <thead>
    <th scope="col">indent_id</th>
    <th scope="col">uid</th>
    <th scope="col">datetime</th>
    <th scope="col">indent_state</th>
    <th scope="col">accept_address</th>
    <th scope="col">accept_name</th>
    <th scope="col">accept_tel</th>
    <th scope="col">invoiceType</th>
    <th scope="col">modeOfPayment</th>
    <th scope="col">expressage</th>
    <th scope="col">1</th>
    </thead>
    <!--<tfoot>
        <td colspan="4">名字：</td>
    </tfoot>-->
    <tbody id="tb">
    <!--<tr>-->
        <!--<td>1</td>-->
        <!--<td>Jamson</td>-->
        <!--<td>123-45678</td>-->
        <!--<td>XX市XX区XX号</td>-->
        <!--<td>Jamson</td>-->
        <!--<td>123-45678</td>-->
        <!--<td>XX市XX区XX号</td>-->
        <!--<td>Jamson</td>-->
        <!--<td>123-45678</td>-->
        <!--<td>XX市XX区XX号</td>-->
        <!--<td>-->
            <!--<div class="btn-group" role="group" aria-label="...">-->
                <!--<button type="button" class="btn btn-default">结账</button>-->
                <!--<button type="button" class="btn btn-default" style="">取消</button>-->
            <!--</div>-->
        <!--</td>-->
    <!--</tr>-->
    </tbody>
</table>
<nav aria-label="Page navigation" style="text-align: center">
    <ul class="pagination" id="list">

    </ul>
</nav>

</body>

</html>
<script type="text/javascript" src="__PUBLIC__/js/jquery-2.1.0.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/bootstrap.min.js"></script>
<script>
    $(function () {

        function GetQueryString(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            var r = window.location.search.substr(1).match(reg);
            if(r != null) return unescape(r[2]);
            return null;
        }

        var page = GetQueryString("page");
        if(page == null)
            page=0;

        getIntent(1,page);

        function getIntent(indent_mode,page) {
            $.ajax({
                url:"/app/sydy/shopping/indent/getIndent?page="+page+"&indent_mode="+indent_mode,
                type:"GET",
                dataType:"json",
                success:function (data) {
                    $("#tb").children().remove();
                    $("#list").children().remove();

                    var obj = '<li> \
                    <a href="#" aria-label="Previous"> \
                        <span aria-hidden="true">&laquo;</span> \
                    </a> \
                </li>';
                    $("#list").append(obj);

                    var count = parseInt(data.count);

                    for(var i=0;i<count/10;i++){
                        var obj = "<li><a href=\"?page="+(i+1)+"\">"+(i+1)+"</a></li>";
                        $("#list").append(obj);
                    }

                    var obj = '<li> \
                    <a href="#" aria-label="Next"> \
                        <span aria-hidden="true">&raquo;</span> \
                    </a> \
                </li>';
                    $("#list").append(obj);
                    var data = data.data;
                    for(var i=0;i<data.length;i++){
                        var obj ='<tr> \
                        <td>'+data[i].indent_id+'</td> \
                        <td>'+data[i].uid+'</td> \
                        <td>'+data[i].datetime+'</td> \
                        <td>'+data[i].indent_state+'</td> \
                        <td>'+data[i].accept_address+'</td> \
                        <td>'+data[i].accept_name+'</td> \
                        <td>XX市XX区XX号</td> \
                        <td>'+data[i].accept_name+'</td> \
                        <td>123-45678</td> \
                        <td>XX市XX区XX号</td> \
                        <td> \
                            <div class="btn-group" role="group" aria-label="..."> \
                            <button type="button" class="btn btn-default goods">发货</button> \
                            <button type="button" class="btn btn-default" style="">取消</button> \
                            </div> \
                        </td> \
                    </tr>';

                        $("#tb").append(obj);
                    }
                },
                error:function (err) {
                   document.write(JSON.stringify(err));
                }
            });
        }


        $("body").on("click",".goods",function (){
            //$(".goods").index(this)
            $indent_id = $($(this).parent().parent().parent().children("td").get(0)).text();
            $.ajax({
                url:"/app/sydy/index.php/shopping/indent/getIndent?page="+page,
                type:"GET",
                dataType:"json",
                success:function () {
                    
                }
            })
        });

        $(".dropdown-menu > li").on("click",function () {

            var obj = $('#'+$(this).parent().attr("aria-labelledby"));
            obj.text("");
            obj.append($(this).text()+'<span class="caret"></span>');

            getIntent($(this).index()+1,page);
        })
    })
</script>